<script setup lang="ts"></script>

<template>
  <div class="header">
    <img src="../img/dkw.png" width="30" alt="" />
    <div class="title">录屏大师</div>
    <div class="seeting">设置</div>
    <div class="menu">菜单</div>
    <div class="split">|</div>
    <img src="../img/min.png" alt="" class="min" width="25" srcset="" />
    <img src="../img/close.png" alt="" class="close" width="15" srcset="" />
  </div>
</template>
<style scoped>
.header {
  height: 50px;
  background-color: #25272e;
  -webkit-app-region: drag;
  display: flex;
  align-items: center;
  color: white;
  box-sizing: border-box;
  padding: 0 20px;
  font-size: 14px;
}
.title {
  margin-left: 10px;
}
.split {
  margin: 0 20px;
}
.min {
  margin-right: 15px;
}
.seeting {
  margin-left: auto;
  margin-right: 15px;
}
.seeting,
.close,
.min,
.menu {
  -webkit-app-region: no-drag;
  cursor: pointer;
}
</style>
